<template>
  <div class="tree">
    <p class="tip">用例库</p>
      <NodeTree :treeNodes="treeNodes" @edit="edit" @add="add" @remove="remove"
                @nodeSelectEvent="nodeSelectEvent" class="node"></NodeTree>
    </div>
</template>

<script>
import NodeTree from "@/components/Tree/index";

export default {
  name: 'SceneTree',
  components: {NodeTree},
  data() {
    return {
      currentKey: "",
      projectId: window.sessionStorage.getItem("projectId"),
      treeNodes: []
    }
  },
  methods: {
    getTreeNode() {
      this.api({
        url: `/getSceneTree/${this.projectId}`,
        method: "get"
      }).then(resp => {
        this.treeNodes = resp.list;
      });
    },
    remove(nodeIds, data) {
      this.api({
        url: "/deleteScene",
        method: "post",
        data: {idList: nodeIds}
      }).then(resp => {
        if (resp.code !== "500") {
          this.$message({message: resp, type: 'success'});
        }
        this.getTreeNode();
      });
    },
    edit(data) {
      const params = {
        name: data.name,
        id: data.id,
        updateUser: this.$store.state.user.userId
      };
      this.api({
        url: "/updateScene",
        method: "put",
        data: params
      }).then(resp => {
        this.$message({message: resp, type: 'success'});
      });
    },
    add(data) {
      const params = {...data};
      params.projectId = this.projectId;
      params.createUser = this.$store.state.user.userId;
      !params.parentId ? params["parentId"] = "0" : params;
      this.api({
        url: "/addScene",
        method: "post",
        data: params
      }).then(resp => {
        this.getTreeNode();
        this.$message({message: resp, type: 'success'});
      });
    },
    nodeSelectEvent(data, nodeIds, pNodes) {
      this.$emit('nodeClick', nodeIds)
    }
  },
  mounted() {
    this.getTreeNode()
  }

}
</script>

<style scoped>
.tip {
  padding: 0 5px;
  font-size: 16px;
  border-radius: 0;
  border-left: 4px solid #0044f0;
  font-weight: 700;
  margin-top: -10px;
}
.tree {
  padding: 20px;
}

.node {
  width: 260px;
}
</style>
